import Vue from 'vue'
import Vuex from 'vuex'
import { mapState } from 'vuex'
Vue.use(Vuex)

const store = new Vuex.Store({
  state: {
    name: 'lily',
    age: '30岁',
    count: 0,
  },
  computed: mapState({
    // 箭头函数可使代码更简练
    count: state => state.count,

    // 传字符串参数 'count' 等同于 `state => state.count`
    countAlias: 'count',

  // 为了能够使用 `this` 获取局部状态，必须使用常规函数
    countPlusLocalState (state) {
      return state.count + this.localCount
    }
  }),
  mutations: {
    showPeople(state, msg){
      state.name = msg.name;
      state.age = msg.age;
    },
    mutationsAddCount(state, n = 0) {
      return (state.count += n)
    },
    mutationsReduceCount(state, n = 0) {
      return (state.count -= n)
    }
  },
  actions: {
    actionAddAge(context, n = 0){
      console.log(context)
      return context.commit('mutationsAddCount',n);
    },
    actionReduceAge({commit}, n = 0){
      return commit('mutationsReduceCount',n);
    }
  }
})
export default store
